<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>
<script>
	
// JavaScript是单线程的语言 (代码从上到下执行)
// Event Loop是javascript的执行机制    事件队列(浏览器的)
// 同步    一个一个的   头一个做完之前后面的不准许动
// 异步    一块去做不分你我       你做你的我做我的


//什么是微任务\什么是宏任务 
		// 宏任务微任务？ 即函数代码片段的执行顺序  从上至下 js执行顺序  单线程  
		// 先执行同步和立即执行任务，比如说 new Promise()  console.log() 函数
		// 再依次执行微任务，比如说then able函数和catch able函数   即异步函数的异步
		// 当微任务执行完成后开始执行宏任务，比如说定时器、事件回调等           
	    // 代码执行时 微优先宏        微即new  宏即两种定时器      
		setTimeout(() => {
			console.log('1')
		}, 0);
		Promise.resolve().then(() => {
			console.log('2');
			Promise.resolve().then(() => {
				console.log('3');
			})
		})
		 console.log('4');   //4 2 3 1
//--------------------------------------------
		setTimeout(function() {
			console.log('1')
		});
		new Promise(function(resolve) {
			console.log('2');
			resolve();
	
		}).then(function() {
			console.log('3')
		});
		console.log('4');  // 2 4 3 1
//--------------------------------------------
     function fn(){
         console.log('fn')
     }
     setTimeout(function(){          //定时器属异步
         console.log( 'settimeout')
	 },0)
     fn()
     new Promise(function(resolve){  //异步操作解决方案 同步操作 本身属异步  回调then属异步     异步操作都是在同步的后面
         console.log('promise1')
         resolve()
     }).then(function(){             //then后面必须跟一个函数体 否则为 null  
         console.log( 'promise2')
     })
    console.log( 'script') 
    //                                // fn p1 script p2 settimeout


//demo 
function f(){                   //因为是一个函数，调用时才会执行函数中的代码
		return new Promise((resolve,reject)=>{
			console.log(1)          //调用代码时Promise实例对象中的输出会立即执行；
			setTimeout(()=>{        //延迟定时器会最后执行；
				console.log(2)
				resolve(1000000)    //延迟定时器会最后执行，又因为定时器中有获取数据要有个时间过程，所以这个函数中的输出会最后执行
				console.log(3)      //会在resolve函数的前面执行；
			},2000)
			console.log(4)          //定时器时多线程，
		})
    }
    console.log(5)
    async function a(){     //只定义一个异步函数，不执行异步函数中的代码
        console.log(6)
        const r=await f()
        console.log(r)      //这里会先执行r后执行7,输出是从上往下执行代码；
        console.log(7)
    }
    console.log(8)  
    a()//异步函数的调用：执行函数中的代码
       //返回：5 8 6 1 4 2 3 100000 7
</script>